<style lang="sass" scoped>
    .container{
        padding-top:140px;
    }
    .form{
        width:524px;
        margin:0 auto;
        .group{
            margin-bottom:20px;
            .labels{
                font-size:40px;
            }
            input{
                width:524px;
                height:70px;
                border:1px solid #000;
                border-radius:60px;
                padding:0 20px;
                font-size:34px;
            }
        }
    }
    .detail{
        text-align:center;
        margin:50px 0 80px;
        p{
            font-size:26px;
            color:#969696;
        }
    }
    .next{
        width:220px;
        height:84px;
        line-height:84px;
        text-align:center;
        color:#fff;
        background:#ff7575;
        font-size:34px;
        margin:40px auto;
        border-radius:60px;
    }
</style>
<template>
    <div class="container">
        <div class="form">
            <div class="group">
                <div class="labels">WIFI</div>
                <input v-model.trim="form.ssid" type="text" placeholder="">
            </div>
            <div class="group">
                <div class="labels">{{'password' | enFy($route)}}</div>
                <input v-model.trim="form.pass" type="text" placeholder="">
            </div>
        </div>
        <!-- <div class="detail">
            <p>如果需要与电视连接</p>
            <p>请确保选取网络与电视网络</p>
            <p>处于同一网络</p>
        </div> -->
        <div @click="next()" class="next">{{'next' | enFy($route)}}</div>
    </div>
</template>
<script>
    export default {
        components: {
        },
        data() {
            return {
                form:{
                    ssid:'',
                    pass:'',
                }
            }
        },
        watch:{
        },
        created(){

        },
        mounted() {
            this.$nextTick(() => {
                if(util.getStorage('local','reocrd-ssid-pass')){
                    this.form.ssid = JSON.parse(util.getStorage('local','reocrd-ssid-pass')).ssid
                    this.form.pass = JSON.parse(util.getStorage('local','reocrd-ssid-pass')).pass
                }
            });
        },
        methods: {
            next(){
                
                if(this.form.ssid===''){
                   popup.alert({content:'网络名称不能为空'});
                   return;
                }
                if(this.form.pass!==''&&this.form.pass.length<8){
                   popup.alert({content:'密码不得少于8位'});
                   return;
                }
                let url = `ssid:${this.form.ssid};pass:${this.form.pass}`
                console.log(typeof this.$route.query.online)
                if(this.$route.query.online==='1'){
                    let userinfo = util.getStorage('local','userinfo');
                    if(!userinfo&&!JSON.parse(userinfo).openid){
                        popup.miss({
                            content:'丢失openid'
                        })
                        return;
                    }
                    url+=`;openId:${JSON.parse(userinfo).openid}`
                }
                util.setCookie('qrcode',encodeURIComponent(url),7)
                util.setStorage('local','reocrd-ssid-pass',JSON.stringify({ssid:this.form.ssid,pass:this.form.pass}))
                router.replace({name:'scancode3',query:{online:this.$route.query.online,language:this.$route.query.language}});
            }
        },
        
    };
</script>